
let navlist = document.querySelector("ul.navList")
let info = document.querySelector("#product>ul")
let uu = document.querySelector(".navList")



// 获取点击的data-titleid
uu.addEventListener("click", function (e) {
    // 获取点击的data-titleid
    let titleid;
    let _this = e.target
    if (_this.localName === "li") {
        titleid = _this.getAttribute("data-titleid")
        // console.log(titleid);
        $(_this).css({ "color": "#fc353a" }).siblings().css({ "color": "#000" })
        request(titleid)
    }
})

//nav列表
fetch("http://chst.vip:1234/api/getbaicaijiatitle")
    .then(response => response.json())
    .then(res => {
        // console.log(res.result);
        let domlis = ''
        res.result.forEach(item => {
            // console.log(item.title);
            domlis += `<li data-titleid=${item.titleId}>${item.title}</li>`
        })
        navlist.innerHTML = domlis
    })



request(0);

function request(titleid) {
    fetch("http://chst.vip:1234/api/getbaicaijiaproduct?titleid=" + titleid)
        .then(response => response.json())
        .then(res => {
            // console.log(res.result);
            render(res.result, info);
        })



}

function render(data, container) {
    let domStr = ''
    data.forEach(item => {
        // console.log(item.productCouponRemain);
        domStr += `
        <li>
            <a href="#" class="box">
                            <div class="img">
                            ${item.productImg}
                            </div>
                            <div class="other">
                                <div class="title">
                                    <h4>
                                    ${item.productName}
                                    </h4>
                                    <div class="price">
                                    ${item.productPrice}
                                    </div>
                                </div>
                                <div class="down">
                                    <div class="bar">
                                        <div class="bar_in">100%</div>
                                    </div>
                                    <span class="yiling">已领126张/剩余0张</span>
                                    <div class="click">
                                        <div class="left">点此领取优惠券</div>
                                        <div class="right">下单链接</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                    </li>
        `
    })
    container.innerHTML = domStr
}
